<?php if (defined("YTDJ") or die()); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<title>VideoJockey - Take control of the video's you play! </title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="Pragma" content="no-cache" />
	<meta http-equiv="Expires" content="-1" />
	<meta http-equiv="Cache-Control" content="no-cache" />
	<meta name="robots" content="index, follow" />
	<meta name="keywords" content="Youtube, DJ, Video, Jockey, VJ, online, mix, mixing, party" />
	<meta name="description" content="Take control of the video's you play! VideoJockey let you mix your favorite YouTube music video's to rock the party!" />
	<meta name="language" content="en" />
	
	<link type="text/css" rel="stylesheet" href="css/videojockey.css" />
	
	<link type="text/css" rel="stylesheet" href="css/active-indicator.css" />
	<link type="text/css" rel="stylesheet" href="css/vidtitle.css" />
	<link type="text/css" rel="stylesheet" href="css/video.css" />
	<link type="text/css" rel="stylesheet" href="css/controller.css" />
	
	<link type="text/css" rel="stylesheet" href="css/autodj.css" />
	<link type="text/css" rel="stylesheet" href="css/list.css" />
	<link type="text/css" rel="stylesheet" href="css/load.css" />
	<link type="text/css" rel="stylesheet" href="css/search.css" />
	<link type="text/css" rel="stylesheet" href="css/playlist.css" />
	<link type="text/css" rel="stylesheet" href="css/improve.css" />
	
	<?php if ($_GET["debug"]=="1") { ?>
		<link type="text/css" rel="stylesheet" href="css/debug.css" />
	<?php } ?>

	<script src="js/jquery-1.2.4a.js" type="text/javascript"></script>	
	<script src="js/jquery.dimensions.js" type="text/javascript"></script>	
	<script src="js/jquery.dragdrop.js" type="text/javascript"></script>	
	<script src="js/jquery.tooltip.js" type="text/javascript"></script>
	
	<!--<script src="js/ui/ui.core.js" type="text/javascript"></script>
	<script src="js/ui/ui.slider.js" type="text/javascript"></script>
	<script src="js/ui/ui.slider.js" type="text/javascript"></script>//-->
	
	<script src="js/swfobject.js" type="text/javascript"></script>    
	
	<script src="js/ytdj.initial.js" type="text/javascript"></script>
	<script src="js/ytdj.general.js" type="text/javascript"></script>
	<script src="js/ytdj.timer.js" type="text/javascript"></script>
	<script src="js/ytdj.load.js" type="text/javascript"></script>
	<script src="js/ytdj.playlist.js" type="text/javascript"></script>	
	<script src="js/ytdj.print.js" type="text/javascript"></script>
	<script src="js/ytdj.vis.js" type="text/javascript"></script>
	<script src="js/ytdj.set.js" type="text/javascript"></script>
	<script src="js/ytdj.video.js" type="text/javascript"></script>
	<script src="js/ytdj.slider.js" type="text/javascript"></script>
	<script src="js/ytdj.fader.js" type="text/javascript"></script>
	<script src="js/ytdj.volume.js" type="text/javascript"></script>
	<script src="js/ytdj.lfm.js" type="text/javascript"></script>
	<script src="js/ytdj.controls.js" type="text/javascript"></script>
	<script src="js/ytdj.state.js" type="text/javascript"></script>	
	<script src="js/ytdj.autodj.js" type="text/javascript"></script>	
	<script src="js/ytdj.scroller.js" type="text/javascript"></script>
	<script src="js/ytdj.improve.js" type="text/javascript"></script>		
	
</head>
<body>

<div id="wrapper">

	<!-- <div id="beta">This website is currently in beta, please <a href="mailto:hongaar@gmail.com">let me know</a> what you think of it!<br/>&nbsp;</div> -->
	
	<div id="logo"></div>
	
	<div id="panel">
		
		<?php // ACTIVE INDICATOR ?>
	
		<div id="active-indicator-0" class="active-indicator">
			<div class="indicator off"></div>
			<div class="label"></div>
		</div>
		
		<div id="active-indicator-1" class="active-indicator">
			<div class="indicator off"></div>
			<div class="label"></div>
		</div>
		
		<?php // LABEL ?>
		
		<div id="vid-0-title" class="vid-title"></div>
		<div id="vid-1-title" class="vid-title"></div>
		
		<?php // VIDEO SCREENS ?>
		
		<div id="vid-0-wrapper" class="vid-wrapper">
			<div id="vid-0" class="vid-ytdisplay">
				You need <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash player 8+</a> and <a href="http://www.google.com/support/bin/answer.py?answer=23852" target="_blank">JavaScript enabled</a> to view this video.
			</div>
			<div id="vid-0-ytoverlay" class="vid-ytoverlay" onclick="fadeTo(0);">
				<div class="improve-link" id="improve-0-link">
					<a href="javascript:void(null);">Improve this!</a>
				</div>
				<div class="improve-panel" id="improve-0-panel"></div>
			</div>
		</div>
		
		<div id="vid-1-wrapper" class="vid-wrapper">
			<div id="vid-1" class="vid-ytdisplay">
				You need <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash player 8+</a> and <a href="http://www.google.com/support/bin/answer.py?answer=23852" target="_blank">JavaScript enabled</a> to view this video.
			</div>
			<div id="vid-1-ytoverlay" class="vid-ytoverlay" onclick="fadeTo(1);">
				<div class="improve-link" id="improve-1-link">
					<a href="javascript:void(null);">Improve this!</a>
				</div>
				<div class="improve-panel" id="improve-1-panel"></div>
			</div>
		</div>
		
		<?php // CONTROLLER PANEL ?>
		
		<div id="s1" class="screw"></div>
		<div id="s2" class="screw"></div>
		
		<div id="controller">
		
			<div class="vid-controllers" id="vid-0-controllers">
			
				<div onclick="videoTogglePlay(0);" class="play-button off"></div>
				<div class="label-play"></div>
				
				<div id='vid-0-slider' class='vid-slider-h'>
					<div class='vid-slider-load'></div>
					<div class='vid-slider-pos-handle'></div>
				</div>
				
				<div id='vid-0-volume' class='vid-slider-v'>
					<div class='vid-slider-vol-handle'></div>
				</div>
			
			</div>
			
			<div class="vid-controllers" id="vid-1-controllers">
			
				<div onclick="videoTogglePlay(1);" class="play-button off"></div>
				<div class="label-play"></div>
				
				<div id='vid-1-slider' class='vid-slider-h'>
					<div class='vid-slider-load'></div>
					<div class='vid-slider-pos-handle'></div>
				</div>
				
				<div id='vid-1-volume' class='vid-slider-v'>
					<div class='vid-slider-vol-handle'></div>
				</div>
			
			</div>
			
			<div id="fader">
			
				<div id='fader-slider' class='vid-slider-h'>
					<div class='vid-slider-fader-handle'></div>
				</div>
				
			</div>
		
		</div>
		
		<div id="s3" class="screw"></div>
		<div id="s4" class="screw"></div>
		
		<?php // SEARCH ?>
		
		<div id="search-wrapper" class="area nopadding">
			
			<div class="title">search</div>

			<div id="search-form">
				<form action="index.php" method="get" onsubmit="loadResults();return false;">
				Zoek naar 
					<input id="search-q" name="search-q" type="text" size="20" value="shantel" />
					<input type="submit" value="Zoek!" />
				</form>
			</div>
			
			<div id="search-status">1</div>
				
			<div id="search-results" class="results-list"></div>
			
		</div>
		
		<?php // AUTODJ ?>
		
		<div id="dj-wrapper" class="area">
			
			<div id="dj-button" class="off" onclick="toggleAutoDJ();"></div>
			<div id="dj-button-label"></div>
			<div id="dj-next" onclick="djNext();"></div>
			<div id="dj-next-label"></div>
			
		</div>
		
		<?php // SMALL LOGO ?>
		
		<div id="logo-klein"></div>
				
		<?php // PLAYLIST ?>
			
		<div id="playlist-wrapper" class="area nopadding">
			
			<div class="title">playlist</div>
		
			<!--<div id="playlist-title">Playlist <a href="javascript:void(0);" onclick="loadEntryFromLFM();">Add 1 similar track</a></div>//-->
			
			<div id="playlist-list" class="results-list"></div>
			
		</div>			
			
	</div>
	
	<div id="credits">
		Powered by <a href="http://www.youtube.com" target="_blank">YouTube</a> &amp; <a href="http://www.last.fm" target="_blank">Last.fm</a><br/>
		&copy; 2009 <a href="http://joram.vandenboezem.nl" target="_blank">joram.vandenboezem.nl</a> &amp; <a href="http://www.jesperedesign.nl" target="_blank">J'espere Design</a><br/>
		VideoJockey is <a href="http://code.google.com/p/videojockey/" target="_blank">Open source software</a>!
	</div> 
	
</div>

<div id="msg"><strong>USER MSG OUTPUT STARTED</strong></div>

<div id="log"><strong>DEBUG OUTPUT STARTED</strong></div>

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-5059229-1");
pageTracker._initData();
pageTracker._trackPageview();
</script>

</body>
</html>